<template>
    <div id="header">
      <div id="top_login">
        <form v-if="userInfo === null">
          <input type="hidden" name="opr" value="login"/>
          <label> 登录名 </label>
          <input type="text" name="uname" v-model="uname" @focus="clearErrorMsg" class="login_input" />
          <label> 密&#160;&#160;码 </label>
          <input type="password" name="upwd" v-model="upwd" @focus="clearErrorMsg" class="login_input" />
          <input type="button" class="login_sub" @click="login" value="登录" />
          <input type="button" class="login_sub" @click="register" value="注册" />
          <label id="error" class="error">{{errorMsg}}</label>
          <img src="@/assets/images/friend_logo.gif" alt="Google" id="friend_logo" />
        </form>
        <h3 v-else>
          欢迎<span>{{userInfo.uname}}</span>
          <button class="login_sub" @click="loginOut">退出</button>
          <button v-if="this.userInfo.utype===1" class="login_sub" @click="goBackManager">管理</button>
          <img src="@/assets/images/friend_logo.gif" alt="Google" id="friend_logo" />
        </h3>
      </div>
      <div id="nav">
        <div id="logo">
          <img src="@/assets/images/logo.jpg" alt="新闻中国" @click="toIndex"/>
        </div>
        <div id="a_b01"> <img src="@/assets/images/a_b01.gif" alt="" /> </div>
      <!--mainnav end-->
      </div>
    </div>
</template>

<script>
export default {
    name:'NewsHead',
    data(){
      return {
        uname:'',
        upwd:'',
        errorMsg:'',
        userInfo:null
      }
    },
    created(){
      if(sessionStorage.getItem('token') != null){
        this.userInfo = JSON.parse(sessionStorage.getItem('token')).user
      }
    },
    methods:{
      //回首页
      toIndex(){
        this.$bus.$emit('adminLogin',2)
        this.$router.push({
          name:'index-main'
        },()=>{})
      },
      //登录
      login(){
        if(this.uname===''){
          this.errorMsg = '登录名不能为空！'
          return
        }
        if(this.upwd === ''){
          this.errorMsg='密码不能为空！'
          return
        }
        this.$axios({
          url:'/api/login',
          method:'post',
          data:{
            name:this.uname,
            pwd:this.upwd
          }
        }).then(rs=>{
          console.log(rs.data)
          if(rs.data.code === 5500){
            this.errorMsg=rs.data.msg
            return
          }
          if(rs.data.code === 5200){
            sessionStorage.setItem('token',JSON.stringify(rs.data.data))
           
            this.userInfo = rs.data.data.user
            this.uname=''
            this.upwd=''

            //对当前路由进行一次刷新
            let fullPath = this.$route.fullPath
            this.$router.replace({ path: '/refresh', query: { t: Date.now() }})
            this.$router.replace({ path: fullPath })
          }
        })
      },
      //注册
      register(){
        this.$router.push({name:'UserRegister'},()=>{})
      },
      //清除错误提示
      clearErrorMsg(){
        this.errorMsg = ''
      },
      //退出
      loginOut(){
        this.$axios({
          url:'/api/exit'
        }).then(rs=>{
          console.log('exit',rs)
          // if(rs.data.data){
            sessionStorage.clear()
            this.userInfo=null
            this.$router.replace({name:'index-main'},()=>{})
          // }
          this.$bus.$emit('adminLogin',2)
        })
      },
      //进入后台管理
      goBackManager(){
        //调用全局事件，用于改变左侧显示为管理员菜单
        this.$bus.$emit('adminLogin',this.userInfo.utype)
        this.$router.replace({name:'NewsManager'},()=>{})
      }
    }
}
</script>

<style scoped>
  .error{
    color: red;
    font-style: italic;
    font-weight: bolder;
    margin: 0em 0.5em;
  }
</style>